<template>
  <view class="container">
    <view class="title">🤖 RAG知识问答系统</view>
    <view class="subtitle">UniApp测试页面</view>
    <view class="content">
      <view class="card">
        <view class="card-title">系统状态</view>
        <view class="card-content">
          <view class="status-item">
            <text class="status-label">文档总数:</text>
            <text class="status-value">{{ stats.totalDocuments }}</text>
          </view>
          <view class="status-item">
            <text class="status-label">已处理:</text>
            <text class="status-value">{{ stats.processedDocuments }}</text>
          </view>
          <view class="status-item">
            <text class="status-label">对话次数:</text>
            <text class="status-value">{{ stats.totalChats }}</text>
          </view>
        </view>
      </view>
      
      <view class="actions">
        <button class="btn" @click="testFunction">测试功能</button>
        <button class="btn btn-primary" @click="navigateToChat">开始对话</button>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      stats: {
        totalDocuments: 5,
        processedDocuments: 3,
        totalChats: 12
      }
    }
  },
  onLoad() {
    console.log('页面加载成功！')
  },
  methods: {
    testFunction() {
      uni.showToast({
        title: '功能正常！',
        icon: 'success'
      })
    },
    navigateToChat() {
      uni.showToast({
        title: '跳转到聊天页面',
        icon: 'success'
      })
      uni.switchTab({
        url: '/pages/chat/index'
      })
    }
  }
}
</script>

<style scoped>
.container {
  padding: 40rpx;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  min-height: 100vh;
  color: white;
}

.title {
  font-size: 48rpx;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20rpx;
}

.subtitle {
  font-size: 28rpx;
  text-align: center;
  opacity: 0.8;
  margin-bottom: 60rpx;
}

.content {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 20rpx;
  padding: 40rpx;
  backdrop-filter: blur(10rpx);
}

.card {
  margin-bottom: 40rpx;
}

.card-title {
  font-size: 32rpx;
  font-weight: bold;
  margin-bottom: 30rpx;
}

.card-content {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}

.status-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10rpx;
}

.status-label {
  font-size: 28rpx;
}

.status-value {
  font-size: 28rpx;
  font-weight: bold;
  color: #ffd700;
}

.actions {
  display: flex;
  gap: 20rpx;
}

.btn {
  flex: 1;
  padding: 30rpx;
  border-radius: 15rpx;
  border: none;
  font-size: 28rpx;
  background: rgba(255, 255, 255, 0.2);
  color: white;
}

.btn-primary {
  background: #28a745;
}
</style> 